<template>
  <el-header id="root">
    <nav>
      <div>
        <img src="@/assets/img/logo.png" height="50" style="margin-left: 0" />
      </div>
      <div class="el-menu-item" @click="goindex">个人信息</div>
      <div class="el-menu-item" @click="notes">发布职位</div>
      <div class="el-menu-item" @click="message">查看消息</div>
      <div class="el-menu-item" href="#">行业</div>
      <div class="el-menu-item" @click="logout">退出登录</div>
    </nav>
  </el-header>
</template>

<script>
export default {
  methods: {
    notes() {
      this.$router.push("/employer/releasePosition");
    },
    goindex() {
      this.$router.push("/employer/profile");
    },
    message() {
      this.$router.push("/employer/message");
    },
    logout() {
      this.axios.get("/user/logout").then((res) => {
        if (res.data.code == 200) {
          sessionStorage.removeItem("username");
          this.$router.push("/");
        }
      });
    },
  },
};
</script>
<style scoped>
#root {
  position: fixed;
  left: 0;
  top: 0;
  background-color: #475359;
  width: 100%;
  height: 72px !important;
  z-index: 2;
  filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
  -moz-box-shadow: 2px 2px 10px #909090;
  -webkit-box-shadow: 2px 2px 10px #909090;
  box-shadow: 2px 2px 10px #909090;
}
nav {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
nav .el-menu-item {
  color: #ffffff;
  padding: 5px 100px;
  position: relative;
  text-align: center;
  border-bottom: transparent;
  display: flex;
  transition: 0.4s;
  font-size: larger;
  font-weight: bold;
}
nav .el-menu-item:hover {
  background-color: #517895;
  border-bottom: solid 6px;
  border-bottom-color: brown;
  /* height: 80px; */
}
</style>